@charset "UTF-8";
@import "reset";
//处理px单位的值，转换为rem单位；
@function r($px) {
    @return $px/100px*1rem;
}

* {
    font-size: 0;
}

.centont {
    padding-top: r(89px);
    padding-bottom: r(96px);
    //  轮播图
    .img_lg {
        position: relative;
        .shaded_img {
            width: 100%;
            height: r(357px);
            img {
                width: 100%;
                height: 100%;
            }
        }
        .shaded {
            height: r(107px);
            width: 100%;
            background-color: #6d6d6d;
            opacity: 0.9;
            position: absolute;
            bottom: 0;
            padding: r(19px) r(23px) r(24px) r(26px);
            .shaded_box {
                display: flex;
                p {
                    font-size: r(27px);
                    color: white;
                }
                >div:first-child {
                    background-color: #b20000;
                }
            }
            .shaded_box2 {
                display: flex;
                justify-content: center;
                padding-top: r(14px);
                img {
                    width: r(8px);
                    height: r(8px);
                    margin-left: r(24px);
                }
            }
        }
    }
    //  文字内容区域
    .article_text {
        padding: r(20px) r(28px) r(31px) r(28px);
        //      第一行
        .content_box1 {
            display: flex;
            justify-content: space-between;
            >li:first-child {
                >div:first-child {
                    width: r(282px);
                    height: r(182px);
                    >img {
                        width: 100%;
                        height: 100%;
                    }
                }
                .soy_sauce {
                    width: r(282px);
                    background-color: #f6f6f6;
                    >p {
                        font-size: r(22px);
                        text-align: justify;
                        padding-top: r(15px);
                    }
                    >div:nth-child(2) {
                        display: flex;
                        justify-content: space-between;
                        padding: 0 r(7px);
                        padding-top: r(15px);
                        >a {
                            >button {
                                width: r(88px);
                                height: r(27px);
                                font-size: r(18px);
                                border-radius: r(5px);
                                text-align: center;
                                background-color: #B20000;
                                color: white;
                            }
                        }
                        >div:nth-child(2) {
                            img {
                                width: r(21px);
                                height: r(19px);
                            }
                            span {
                                font-size: r(20px);
                                color: #c5c5c5;
                            }
                        }
                        >div:last-child {
                            img {
                                width: r(24px);
                                height: r(14px);
                            }
                            span {
                                font-size: r(20px);
                                color: #c5c5c5;
                            }
                        }
                    }
                    .head_portrait {
                        display: flex;
                        align-items: center;
                        padding-top: r(15px);
                        >img {
                            width: r(35px);
                            height: r(35px);
                        }
                        span {
                            font-size: r(18px);
                            color: #c5c5c5;
                            padding-left: r(10px);
                        }
                    }
                }
            }
            >li:last-child {
                >div:first-child {
                    width: r(282px);
                    height: r(182px);
                    >img {
                        width: 100%;
                        height: 100%;
                    }
                }
                .soy_sauce {
                    width: r(282px);
                    background-color: #f6f6f6;
                    >p {
                        font-size: r(22px);
                        text-align: justify;
                        padding-top: r(15px);
                    }
                    >div:nth-child(2) {
                        display: flex;
                        justify-content: space-between;
                        padding: 0 r(7px);
                        padding-top: r(15px);
                        >a {
                            >button {
                                width: r(88px);
                                height: r(27px);
                                font-size: r(18px);
                                border-radius: r(5px);
                                text-align: center;
                                background-color: #B20000;
                                color: white;
                            }
                        }
                        >div:nth-child(2) {
                            img {
                                width: r(21px);
                                height: r(19px);
                            }
                            span {
                                font-size: r(20px);
                                color: #c5c5c5;
                            }
                        }
                        >div:last-child {
                            img {
                                width: r(24px);
                                height: r(14px);
                            }
                            span {
                                font-size: r(20px);
                                color: #c5c5c5;
                            }
                        }
                    }
                    .head_portrait {
                        display: flex;
                        align-items: center;
                        padding-top: r(15px);
                        >img {
                            width: r(35px);
                            height: r(35px);
                        }
                        span {
                            font-size: r(18px);
                            color: #c5c5c5;
                            padding-left: r(10px);
                        }
                    }
                }
            }
        }
        //      第二行
        .content_box2 {
            display: flex;
            justify-content: space-between;
            padding-top: r(22px);
            >li:first-child {
                >div:first-child {
                    width: r(282px);
                    height: r(182px);
                    >img {
                        width: 100%;
                        height: 100%;
                    }
                }
                .soy_sauce {
                    width: r(282px);
                    background-color: #f6f6f6;
                    >p {
                        font-size: r(22px);
                        text-align: justify;
                        padding-top: r(15px);
                    }
                    >div:nth-child(2) {
                        display: flex;
                        justify-content: space-between;
                        padding: 0 r(7px);
                        padding-top: r(15px);
                        >a {
                            >button {
                                width: r(88px);
                                height: r(27px);
                                font-size: r(18px);
                                border-radius: r(5px);
                                text-align: center;
                                background-color: #B20000;
                                color: white;
                            }
                        }
                        >div:nth-child(2) {
                            img {
                                width: r(21px);
                                height: r(19px);
                            }
                            span {
                                font-size: r(20px);
                                color: #c5c5c5;
                            }
                        }
                        >div:last-child {
                            img {
                                width: r(24px);
                                height: r(14px);
                            }
                            span {
                                font-size: r(20px);
                                color: #c5c5c5;
                            }
                        }
                    }
                    .head_portrait {
                        display: flex;
                        align-items: center;
                        padding-top: r(15px);
                        >img {
                            width: r(35px);
                            height: r(35px);
                        }
                        span {
                            font-size: r(18px);
                            color: #c5c5c5;
                            padding-left: r(10px);
                        }
                    }
                }
            }
            >li:last-child {
                >div:first-child {
                    width: r(282px);
                    height: r(182px);
                    >img {
                        width: 100%;
                        height: 100%;
                    }
                }
                .soy_sauce {
                    width: r(282px);
                    background-color: #f6f6f6;
                    >p {
                        font-size: r(22px);
                        text-align: justify;
                        padding-top: r(15px);
                    }
                    >div:nth-child(2) {
                        display: flex;
                        justify-content: space-between;
                        padding: 0 r(7px);
                        padding-top: r(15px);
                        >a {
                            >button {
                                width: r(88px);
                                height: r(27px);
                                font-size: r(18px);
                                border-radius: r(5px);
                                text-align: center;
                                background-color: #B20000;
                                color: white;
                            }
                        }
                        >div:nth-child(2) {
                            img {
                                width: r(21px);
                                height: r(19px);
                            }
                            span {
                                font-size: r(20px);
                                color: #c5c5c5;
                            }
                        }
                        >div:last-child {
                            img {
                                width: r(24px);
                                height: r(14px);
                            }
                            span {
                                font-size: r(20px);
                                color: #c5c5c5;
                            }
                        }
                    }
                    .head_portrait {
                        display: flex;
                        align-items: center;
                        padding-top: r(15px);
                        padding-bottom: r(6px);
                        >img {
                            width: r(35px);
                            height: r(35px);
                        }
                        span {
                            font-size: r(18px);
                            color: #c5c5c5;
                            padding-left: r(10px);
                        }
                    }
                }
            }
        }
        //      第三行
        .content_box3 {
            display: flex;
            justify-content: space-between;
            padding-top: r(22px);
            >li:first-child {
                >div:first-child {
                    width: r(282px);
                    height: r(182px);
                    >img {
                        width: 100%;
                        height: 100%;
                    }
                }
                .soy_sauce {
                    width: r(282px);
                    background-color: #f6f6f6;
                    >p {
                        font-size: r(22px);
                        text-align: justify;
                        padding-top: r(15px);
                    }
                    >div:nth-child(2) {
                        display: flex;
                        justify-content: space-between;
                        padding: 0 r(7px);
                        padding-top: r(15px);
                        >a {
                            >button {
                                width: r(88px);
                                height: r(27px);
                                font-size: r(18px);
                                border-radius: r(5px);
                                text-align: center;
                                background-color: #B20000;
                                color: white;
                            }
                        }
                        >div:nth-child(2) {
                            img {
                                width: r(21px);
                                height: r(19px);
                            }
                            span {
                                font-size: r(20px);
                                color: #c5c5c5;
                            }
                        }
                        >div:last-child {
                            img {
                                width: r(24px);
                                height: r(14px);
                            }
                            span {
                                font-size: r(20px);
                                color: #c5c5c5;
                            }
                        }
                    }
                    .head_portrait {
                        display: flex;
                        align-items: center;
                        padding-top: r(15px);
                        padding-bottom: r(6px);
                        >img {
                            width: r(35px);
                            height: r(35px);
                        }
                        span {
                            font-size: r(18px);
                            color: #c5c5c5;
                            padding-left: r(10px);
                        }
                    }
                }
            }
            >li:last-child {
                >div:first-child {
                    width: r(282px);
                    height: r(182px);
                    >img {
                        width: 100%;
                        height: 100%;
                    }
                }
                .soy_sauce {
                    width: r(282px);
                    background-color: #f6f6f6;
                    >p {
                        font-size: r(22px);
                        text-align: justify;
                        padding-top: r(15px);
                    }
                    >div:nth-child(2) {
                        display: flex;
                        justify-content: space-between;
                        padding: 0 r(7px);
                        padding-top: r(15px);
                        >a {
                            >button {
                                width: r(88px);
                                height: r(27px);
                                font-size: r(18px);
                                border-radius: r(5px);
                                text-align: center;
                                background-color: #B20000;
                                color: white;
                            }
                        }
                        >div:nth-child(2) {
                            img {
                                width: r(21px);
                                height: r(19px);
                            }
                            span {
                                font-size: r(20px);
                                color: #c5c5c5;
                            }
                        }
                        >div:last-child {
                            img {
                                width: r(24px);
                                height: r(14px);
                            }
                            span {
                                font-size: r(20px);
                                color: #c5c5c5;
                            }
                        }
                    }
                    .head_portrait {
                        display: flex;
                        align-items: center;
                        padding-top: r(15px);
                        padding-bottom: r(6px);
                        >img {
                            width: r(35px);
                            height: r(35px);
                        }
                        span {
                            font-size: r(18px);
                            color: #c5c5c5;
                            padding-left: r(10px);
                        }
                    }
                }
            }
        }
    }
    .last_text {
        text-align: center;
        padding-bottom: r(17px);
        border-top: 1px solid #e6e6e6;
        p {
            font-size: r(22px);
            color: #bbbbbb;
            padding-top: r(19px);
        }
    }
}